let btn = document.querySelector('button')
// let input = document.querySelector('input')
let input = document.getElementById("myInput")
let city

const name = document.querySelector('.box .city')
const weather = document.querySelector('.box .weather')
const temperature = document.querySelector('.box .temperature')
const humidity = document.querySelector('.box .humidity')
const winddirection = document.querySelector('.box .winddirection')
const windpower = document.querySelector('.box .windpower')
const reporttime = document.querySelector('.box .reporttime')

function getWeather() {
    city = input.value
    if (city === '') {
        alert("此处不能为空!");
    }
    fetch(`https://restapi.amap.com/v3/weather/weatherInfo?city=${city}&key=983ba1456361beb8ddd3cbe47c78ac49`)
        // .then(response => {
        //     // console.log(response.json())
        //     return response.json()
        // })
        // .then(data => console.log(data.lives[0]))
        .then(response => {
            // console.log(response.json())
            return response.json()
        })
        .then(data => {
            name.innerHTML = "城市：" + data.lives[0].city;
            weather.innerHTML = "天气：" + data.lives[0].weather;
            temperature.innerHTML = "温度: " + data.lives[0].temperature + "℃";
            humidity.innerHTML = "湿度：" + data.lives[0].humidity + "%";
            winddirection.innerHTML = "风向：" + data.lives[0].winddirection;
            windpower.innerHTML = "风力：" + data.lives[0].windpower + " 级";
        })
       
}
btn.addEventListener('click', function () {
    getWeather()
})



input.addEventListener('keyup', function (e) {
    if (e.key === 'Enter') {
        getWeather()
    }
})